import React, { Component } from 'react'
import { Link } from 'react-router-dom'
import Header from '../../components/Header/Header'
import {Button,Form, Input, Toast} from 'antd-mobile'
import {reqlogin} from '../../http/api'
 
export default class Login extends Component {
  constructor(){
    super()
    this.state={
      user:{
        phone:'',
        password:''
      }
    }
  }
  login=()=>{
    reqlogin(this.state.user).then(res=>{
      if(res.data.code===200){
        Toast.show({
          content:res.data.msg
        }) 
        //存信息
        sessionStorage.setItem("userInfo",JSON.stringify(res.data.list))
        //跳转
        this.props.history.push('/index/home')
      }
    })
  }
  render() {
    let {user}=this.state
    return (
      <div>
        {/* 父传子 */}
      <Header register title='登录'></Header>
      <div>user:{JSON.stringify(user)}</div>
        <Form layout='horizontal'>
          <Form.Item label='用户名' name='username'>
            <Input placeholder='请输入用户名' clearable onChange={v=>{
              this.setState({
                user:{
                  ...this.state.user,
                  phone:v
                }
              })
            }}/>
          </Form.Item>
          <Form.Item label='密码' name='password'>
            <Input placeholder='请输入密码' clearable type='password' onChange={v=>{
              this.setState({
                user:{
                  ...this.state.user,
                  password:v
                }
              })
            }}/>
          </Form.Item>
        </Form>
      
      <Button color='primary' onClick={()=>this.login()}>登录</Button>

      {/* <Link to='/Index'>前往首页</Link> */}
      </div>
    )
  }
}
